import React from "react"
import { View, Image } from "@tarojs/components"
import styles from "./index.module.css"

type IProps = {
  visible: boolean
  src: string
  message?: string
  onClickMask?(): any
}
const GpImageMask: React.FC<IProps> = function GpMask({ src, message, visible, onClickMask }) {
  function handleMaskClick() {
    onClickMask && onClickMask()
  }
  if (!visible) return null
  return (
    <React.Fragment>
      <View className={styles.mask} onClick={handleMaskClick}></View>
      <View className={styles.content}>
        <View className={styles.contentBody}>
          <Image src={src} mode="widthFix" showMenuByLongpress className="w-580px box-border" />
          {message && <View className={styles.tip}>{message}</View>}
        </View>
      </View>
    </React.Fragment>
  )
}
export default GpImageMask
